<template>
  <div class="company-style">
    <!-- 导航栏 start -->
    <van-nav-bar title="简历" fixed />
    <!-- 导航栏 end -->

    <!-- 主页 start -->
    <div class="resume-index" style="margin: 160px 0 50px">
      <!-- 菜单 -->
      <ul class="menu">
        <li @click="toReceivePage">
          <img src="@/assets/img/company/resume/menu_icon01.png" alt="" />
          <span>收到简历</span>
        </li>
        <li @click="toGainPage">
          <img src="@/assets/img/company/resume/menu_icon02.png" alt="" />
          <span>获取简历</span>
        </li>
        <li @click="toCollectPage">
          <img src="@/assets/img/company/resume/menu_icon03.png" alt="" />
          <span>收藏简历</span>
        </li>
        <!-- <li @click="toReadMe">
          <img src="@/assets/img/company/resume/menu_icon04.png" alt="" />
          <span>谁看过我</span>
        </li> -->
      </ul>

      <!-- 列表 -->
      <van-tabs sticky animated swipeable :offset-top="160" title-active-color="#07f">
        <van-tab title="新收简历">
          <van-pull-refresh v-model="refreshing0" @refresh="onRefresh0">
            <van-empty v-if="list0.length == 0 " description="近半年收到的简历为空"></van-empty>
            <van-list v-else class="my-resume-list" v-model="loading0" :finished="finished0" finished-text="没有更多了" @load="loadData0">
              <div class="item" v-for="(item,index) in list0" :key="index" @click="resumeClick(item.personID,0)">
                <div class="show">
                  <div class="person">
                    <img :src="item.headImgUrl" alt="" />
                    <p>
                      <b>{{item.personName}}</b>
                      <span :class="{'unread':item.readState=='1'}">{{item.readState == '1' ? '已读': '未读'}}</span>
                    </p>
                    <p>
                      <span>{{item.sex}}</span>
                      <span>{{item.age}}岁</span>
                      <span>{{item.edu}}</span>
                      <span>{{item.workYears}}</span>
                    </p>
                  </div>
                  <div class="apply">
                    <span class="txt01">{{item.stationName}}</span>
                    <span>{{item.applyDateStr}}</span>
                  </div>
                </div>
              </div>
            </van-list>
          </van-pull-refresh>
        </van-tab>
        <van-tab title="简历库">
          <van-pull-refresh v-model="refreshing1" @refresh="onRefresh1">
            <van-empty v-if="list1.length == 0" description="暂未有推荐简历，去发布新的岗位试试吧"></van-empty>
            <van-list v-else class="my-resume-list" v-model="loading1" :finished="finished1" finished-text="没有更多了" @load="loadData1">
              <div class="item" v-for="(item,index) in list1" :key="index" @click="resumeClick(item.personID,1)">
                <div class="show">
                  <div class="person">
                    <img src="@/assets/img/company/no-avatar-boy.png" alt="" v-if="item.headImgUrl == '' && item.sex=='男'" />
                    <img src="@/assets/img/company/no-avatar-girl.png" alt="" v-else-if="item.headImgUrl == '' && item.sex=='女'" />
                    <img :src="item.headImgUrl" alt="" v-else />
                    <p>
                      <b>{{item.personName}}</b>
                      <span>{{item.resumeUpdateStr}}</span>
                    </p>
                    <p>
                      <span>{{item.sex}}</span>
                      <span>{{item.age}}岁</span>
                      <span>{{item.edu}}</span>
                      <span>{{item.workYears}}</span>
                    </p>
                  </div>
                  <div class="expect">
                    <span>{{item.salaryWantedStr}}</span>
                    <span>{{item.positionStrWanted}}</span>
                  </div>
                </div>
              </div>
            </van-list>
          </van-pull-refresh>
        </van-tab>
      </van-tabs>
    </div>
    <!-- 主页 end -->
  </div>
</template>

<script>
import { NavBar, Sticky, Tab, Tabs, List, Empty, PullRefresh, Toast } from "vant";
export default {
  name: "ResumeMain",
  components: {
    [NavBar.name]: NavBar,
    [Sticky.name]: Sticky,
    [Tab.name]: Tab,
    [Tabs.name]: Tabs,
    [List.name]: List,
    [Empty.name]: Empty,
    [PullRefresh.name]: PullRefresh,
  },
  // 定义属性
  data() {
    return {
      pageIndex: 0,
      pageIndex1: 0,
      pageSize: 20,
      list0: [],
      list1: [],
      loading0: false,
      loading1: false,
      finished0: false,
      finished1: false,
      refreshing0: false,
      refreshing1: false
    };
  },
  mounted() {
    this.loadData0();
    setTimeout(this.loadData1(), 500);
  },
  // 方法集合
  methods: {
    loadData0() {
      this.pageIndex++;
      this.loading0 = true;
      this.refreshing0 = true;
      this.$api.get('/CompanyResume/GetRecentRecieveResumePageList', { pageIndex: this.pageIndex, pageSize: this.pageSize }).then(res => {
        this.loading0 = false;
        this.refreshing0 = false;
        if (res.success) {
          //no data
          if (this.pageIndex == 1 && res.response.length == 0) {
            //...
						this.finished0 = true;
          }
          //no more data
          else if (this.pageIndex != 0 && res.response.length == 0) {
            this.finished0 = true;
            this.list0 = [...this.list0, ...res.response];
          }
          else {
            this.list0 = [...this.list0, ...res.response];
          }
        }
        else { Toast.fail(res.msg) }
      })
    },
    loadData1() {
      this.pageIndex1++;
      this.loading1 = true;
      this.refreshing1 = true;
      this.$api.get('/CompanyResume/GetCommendResumePageList', { pageIndex: this.pageIndex1 ,pageSize: this.pageSize}).then(res => {
        this.loading1 = false;
        this.refreshing1 = false;
        if (res.success) {
          //no data
          if (this.pageIndex1 == 1 && res.response.length == 0) {
            //...
          }
          //no more data
          else if (this.pageIndex1 != 0 && res.response.length == 0) {
            this.finished1 = true;
            this.list1 = [...this.list1, ...res.response];
          }
          else {
            this.list1 = [...this.list1, ...res.response];
          }
        }
        else { Toast.fail(res.msg) }
      })
    },
    onRefresh0() {
      this.finished0 = false;
      this.loading0 = true;
      this.pageIndex = 0;
      this.list0 = [];
      this.loadData0();
    },
    onRefresh1() {
      this.finished1 = false;
      this.loading1 = true;
      this.pageIndex1 = 0;
      this.list1 = [];
      this.loadData1();
    },
    resumeClick(personID) {
      this.$router.push({ name: 'company-resume-info', query: { personID: personID } });
    },
    toReceivePage() {
      this.$router.push({ name: 'company-resume-receive' })
    },
    toGainPage() {
      this.$router.push({ name: 'company-resume-gain' })
    },
    toCollectPage() {
      this.$router.push({ name: 'company-resume-collect' })
    },
    toReadMe() {
      // this.$router.push({name:'company-resume-readme'})
    }
  },
};
</script>

<style lang="less">
@import "vant/lib/index.less";
@import "@/assets/css/company.less";
@import "@/assets/css/company.css";
</style>